<template>
    <div id="main">
        <div style="font-size:13px; margin-left:10px;">
            <label for="">1.备份数据库的名称是按照当时备份的时间来进行命名的；</label><br><br>
            <label for="">2.对于不同时间的数据库应当按时进行删除操作，避免无用的数据库占用机器空间。</label>
        </div>
        <div style="width:600px;margin-top:30px;margin-left:150px;">
            <Form :model="formItem" :label-width="180" :rules="ruleValidate" ref="formItem">
                <FormItem label="请选择要删除的备份数据库：" prop="selectDatabases">
                    <Select v-model="formItem.selectDatabases" @on-change="handleChange" placeholder="请选择要删除的目标数据库">
                        <Option v-for="item in databaseList" :value="item" :key="item">{{item}}</Option> 
                    </Select>
                </FormItem>
                <FormItem label="备份数据库详细信息">
                </FormItem>
                <FormItem label="数据库名称：">
                    <Input v-model="formItem.database_name" :readonly='true' ></Input>
                </FormItem>   
                <FormItem label="备份创建时间：">
                    <Input v-model="formItem.database_time" :readonly='true'></Input>
                </FormItem>   
                <FormItem>
                    <Button type="info" @click="deleteDatabase('formItem')" v-if="checkPermission('112612')">删除</Button>
                    <Button type="warning" @click="cancel('formItem')" style="margin-left: 18px">取消</Button>
                </FormItem>
            </Form>
        </div>
    </div>
</template>
<script>
    import moment from "moment";
    import parent from "../Parent";
    export default {
        extends:parent,
        data () {
            return {
                formItem: {
                    selectDatabases: '',
                    database_name:'',
                    database_time:''
                },
                databaseList:[],
                ruleValidate:{
                    selectDatabases:[
                         { required: true, message: '请先选择要删除的备份数据库文件', trigger: 'change' }
                    ]
                }
            }
        },
        methods: {
            deleteDatabase(name){
                this.$refs[name].validate((valid)=>{
                    if(valid){
                        this.$Modal.confirm({
                            title:'确认删除备份数据库文件（不可恢复）',
                            content: '<p>继续删除，请点击确定按钮</p><br><p>取消，请点击取消按钮</p>',
                            onOk: () =>{
                                //判断文件类型bak文件
                                if(this.formItem.selectDatabases.split('.')[1] == "bak"){
                                    //传递备份数据库名字到后台，判断这个备份是否存在，存在开始删除
                                    this.api.post('database/delete_database', {delete_database:this.formItem.selectDatabases}, res => {
                                    this.$CustomMessage.success("*数据库备份文件删除成功！");
                                    this.getAllDatabase();
                                    });
                                }else{
                                    this.$CustomMessage.error('*备份数据库文件的扩展名必须为“bak”');
                                }
                            },
                            onCancel: () =>{
                                this.$CustomMessage.info('点击了取消！');
                            }
                        })
                    }else{  
                        this.$CustomMessage.error('请先选择要删除的备份数据库文件！');   
                    }
                })
            },
            getAllDatabase() {
                this.api.post('database/get_databases', null, res => {
                    this.databaseList = res.list;
                });
            },
            handleChange(){
                this.formItem.database_name=this.formItem.selectDatabases;
                var date = moment(this.formItem.selectDatabases.substring(4,this.formItem.selectDatabases.lastIndexOf('.')), "YYYY-MM-DD HH:mm:ss");
                this.formItem.database_time = date.lang("zh-cn").format("LLLL");
                if(this.formItem.database_time == "Invalid date") this.formItem.database_time = "";                
            },
            cancel(name){
                this.$refs[name].resetFields();
            }
        },
        created() {
            this.getAllDatabase();
        }
    }
</script>